<template>
	<view class="shopping-page">
		<view class="shopping-top">
			<view class="shopping-top-navbar">
				<block v-for="item in tabs" :key="item.id">
					<view @click="changeTab(item.id)" class="tab" :class="{'active':item.select}">{{item.name}}</view>
				</block>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tabs: [{
						id: 0,
						name: '购物车',
						select: false
					},
					{
						id: 1,
						name: '我常买',
						select: false
					},
	
				]
				
			}
		},
		methods: {
			
		}
	}
</script>

<style >
.shopping-top{
}
.shopping-top-navbar{
			/* flex:xxx */
			display: flex;
			//justify-content:space-around;
			/* font-size: 20rpx;
			width: 120rpx;
			height: 40rpx;
			 */
			
		}
.tab {
		//设置外边框颜色
		/* 		border: 2rpx solid black; */
		width: 120rpx;
		text-align: center;
		//设置圆括号
		border-radius: 30rpx;
	/* 	margin-top: 50rpx; */
	}
</style>
